<template>
    <div>
        <el-row class="tac">
            <el-col :span="6">
                <el-menu
                default-active="2"
                active-text-color="#e02727"
                class="el-menu-vertical-demo"
                style="text-align:left;font-size:20px"
                router>
                <el-submenu index="1" >
                    <template slot="title">
                    <i class="el-icon-s-goods" style="font-size:18px;"></i>
                    <span style="font-size:18px;">商品管理</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item index="/spInfo">商品信息管理</el-menu-item>
                        <el-menu-item index="/addsp">添加商品信息</el-menu-item>
                        <el-menu-item index="/fenleisp">商品类型管理</el-menu-item>
                    </el-menu-item-group>
        
                </el-submenu>
                <el-submenu index="2">
                    <template slot="title">
                    <i class="el-icon-s-order" style="font-size:18px;"></i>
                    <span style="font-size:18px;">订单管理</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item index="/ddinfo">订单信息</el-menu-item>
                    </el-menu-item-group>
        
                </el-submenu>
                <el-submenu index="3">
                    <template slot="title">
                    <i class="el-icon-s-custom" style="font-size:18px;"></i>
                    <span style="font-size:18px;">用户管理</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item index="/userinfo">用户信息</el-menu-item>
                    </el-menu-item-group>
        
                </el-submenu>
                <el-submenu index="4">
                    <template slot="title">
                    <i class="el-icon-s-check" style="font-size:18px;"></i>
                    <span style="font-size:18px;">管理员管理</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item index="/managerinfo">管理员信息</el-menu-item>
                    </el-menu-item-group>
        
                </el-submenu>
                </el-menu>
            </el-col>
            <el-col :span="18" style="height:600px;border-bottom:1px solid #d0c8c8;display: flex;justify-content: center;">
                <router-view></router-view>
            </el-col>
        </el-row>
        
    </div>
</template>
<script>
  export default {
    methods: {
      
    }
  }
</script>
<style scoped>
    .el-menu-item-group{
        background-color: #fdfdf7;
    }
    .tac{
        display: flex;
        align-items: center;
    }
   .el-submenu{
       margin:40px 0;
   }
</style>